<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <script src="/assets/js/jquery-3.3.1.min.js" type="text/javascript"></script>
    <title>公司信息编辑</title>
    <style>
        .newsbar {
            width: 98%;
            border: 1px solid grey;
        }
        .newsbar_header {
            width: 100%;
            height: 38px;
            background-color: rgb(24, 188, 156);
            line-height: 38px;
        }
        .newsbar_header i{
            font-style: normal;
            color: #ff0c00;
        }

        /*内容*/
        .newsbar_content .newsinfo {
            float: left;
            width: 48%;
        }
        .newsbar_content .newsinfo li {
            list-style: none;
            width: 100%;
            height: 30px;
            line-height: 30px;
            margin-top: 20px;
        }
        .newsinfo li .uploadify {
            display: inline-block;
        }
        .newsinfo li input[type=text] {
            width: 200px;
            border-radius: 3px;
            padding-left: 3px;
        }
        .newsinfo li img{
            width: 82px;
            height: 82px;
        }
        .newsinfo li>span {
            display: inline-block;
            width: 100px;
            height: 20px;
            font-weight: bold;
        }
        .newsinfo li i {
            color: red;
            margin-right: 6px;
        }
        .newsinfo li input[name=company_address] {
            width: 256px;
        }
        .newsbar_submit input {
            display: block;
            margin: 0 auto;
            width: 300px;
            height: 40px;
            background-color: #00b9ca;
            line-height: 40px;
            border-radius: 10px;
            font-size: 18px;
            color: #fff;
            margin-top: 20px;
            margin-bottom: 20px;
            outline: none;
        }
        #first_li, #second_li, #third_li, #four_li {
            margin-bottom: 60px !important;
        }
        .img_style {
            width: 120px;
            height: 60px;
            margin-left: 20px !important;
        }
        input[type="file"]{
            display: inline-block !important;
            position: absolute;
            width: 90px;
            height: 30px;
            border: 1px solid red;
            opacity: 0;
            z-index: 999;
        }
        .click_upload {
            display: inline-block !important;
            position: absolute;
            width: 90px;
            height: 30px;
            text-align: center;
            line-height:30px;
            border: 1px solid rgb(24, 188, 156);
            border-radius: 6px;
            font-size: 15px;
            font-family:Arial;
            color: #fff;
            background-color: #00b9ca;
        }
        .upload_button {
            vertical-align: middle;
            display: inline-block;
            width: 90px;
            height: 30px;
            margin-right: 10px;

        }
        .clearfloat{clear:both}
    </style>
</head>
<body>
    <div class="newsbar">
        <div class="newsbar_header">
            <span>1、电脑端信息填写 </span>
            <i>（建议：请尽量填写完整的信息）</i>
        </div>
        <div class="newsbar_content">
            <div class="newsinfo newsbar_left">
                <ul>
                    <li id="first_li">
                        <span><i>*</i>电脑端Logo</span>
                        <div class="upload_button">
                            <input id="file_upload" type="file" multiple="true">
                            <span class="click_upload">点击上传</span>
                        </div>
                        {if condition="$userinfo.company_logo"}
                            <img id="txtimg" src="{$userinfo.company_logo}" alt="电脑端Logo">
                        {else /}
                            <img id="txtimg" src="\assets\image\loginbig.jpg" alt="电脑端Logo">
                        {/if}
                    </li>
                    <li>
                        <span><i>*</i>公司名称</span>
                        <input type="text" name="company_name" value="{$userinfo.company_name}" placeholder="请输入公司名称" disabled>
                    </li>
                    <li>
                        <span><i>*</i>全国服务热线</span>
                        <input type="text" name="connect_tel" value="{$userinfo.connect_tel}" placeholder="请输入全国服务热线">
                    </li>
                    <li>
                        <span><i>*</i>联系人手机</span>
                        <input type="text" name="connect_method" value="{$userinfo.connect_method}" placeholder="请输入联系人手机">
                    </li>
                     <li>
                        <span><i>*</i>公司地址</span>
                        <input type="text" name="company_address" value="{$userinfo.company_address}" placeholder="请输入公司地址">
                    </li>
                    <li>
                        <span>QQ</span>
                        <input type="text" name="qq1" value="{$userinfo.qq1}" placeholder="请输入QQ">
                    </li>
                    <li>
                        <span>传真</span>
                        <input type="text" name="fax_num" value="{$userinfo.fax_num}" placeholder="请输入传真">
                    </li>
                    <li id="second_li">
                        <span>微信图片</span>
                        <div class="upload_button">
                            <input id="file_upload_weixin" type="file" multiple="true">
                            <span class="click_upload">点击上传</span>
                        </div>
                        {if condition="$userinfo.weixin_img"}
                            <img id="txtimg_weixin" src="{$userinfo.weixin_img}" alt="电脑端Logo">
                        {else /}
                            <img id="txtimg_weixin" src="\assets\image\loginbig.jpg" alt="电脑端Logo">
                        {/if}
                    </li>
                    <li>
                        <span>左侧广告名称</span>
                        <input type="text" name="leftad_name" value="{$userinfo.leftad_name}" placeholder="请输入左侧广告名称">
                    </li>

                </ul>
            </div>
            <div class="newsinfo newsbar_right">
                <ul>
                    <li id="third_li">
                        <span>手机端Logo</span>
                        <div class="upload_button">
                            <input id="file_upload_mobile_logo" type="file" multiple="true">
                            <span class="click_upload">点击上传</span>
                        </div>
                        {if condition="$userinfo.mobile_logo"}
                            <img id="txtimg_mobile_logo" src="{$userinfo.mobile_logo}" alt="手机端Logo">
                        {else /}
                            <img id="txtimg_mobile_logo" src="\assets\image\loginbig.jpg" alt="手机端Logo">
                        {/if}
                    </li>
                    <li>
                        <span><i>*</i>官网</span>
                        <input type="text" name="legalurl" value="{$userinfo.legalurl}" placeholder="请输入官网" disabled>
                    </li>
                    <li>
                        <span><i>*</i>联系人姓名</span>
                        <input type="text" name="connect_people" value="{$userinfo.connect_people}" placeholder="请输入联系人姓名">
                    </li>
                    <li>
                        <span><i>*</i>联系人电话</span>
                        <input type="text" disabled name="connect_method" value="{$userinfo.connect_method}" placeholder="请输入联系人电话">
                    </li>
                    <li>
                        <span><i>*</i>ICP备案号</span>
                        <input type="text"  name="icp_code" value="{$userinfo.icp_code}" placeholder="请输入ICP号">
                    </li>
                    <li>
                        <span>QQ</span>
                        <input type="text" name="qq2" value="{$userinfo.qq2}" placeholder="请输入QQ">
                    </li>
                    <li>
                        <span>邮箱</span>
                        <input type="text" name="email" value="{$userinfo.email}" placeholder="请输入邮箱">
                    </li>
                    <li id="four_li">
                        <span>左侧广告图片</span>
                        <div class="upload_button">
                            <input id="file_upload_adimg" type="file" multiple="true">
                            <span class="click_upload">点击上传</span>
                        </div>
                        {if condition="$userinfo.leftad_img"}
                            <img id="txtimg_mobile_adimg" src="{$userinfo.leftad_img}" alt="左侧广告图片">
                        {else /}
                            <img id="txtimg_mobile_adimg" src="\assets\image\loginbig.jpg" alt="左侧广告图片">
                        {/if}
                    </li>
                    <li>
                        <span>左侧广告链接</span>
                        <input type="text" name="leftlink" value="{$userinfo.leftlink}" placeholder="请输入左侧广告链接">
                    </li>
                </ul>
            </div>
            <div class="clearfloat"></div>
        </div>
        <div class="newsbar_submit">
            <input type="submit" name="提交">
        </div>
    </div>
</body>
<script type="text/javascript">

    window.onload = function () {
        //上传的函数
        function qiniuUpload(fileData, img, cssClass) {
            var options = {
                url: '/admin/company/qiniu',
                type: 'post',
                data: fileData,
                contentType: false, // 告诉jQuery不要去设置请求头
                processData: false, // 告诉jQuery不要将data属性指定的对象转换为字符串
                success: function (res) {
                    if (res.status == 1) {
                        $(img).attr('src', res.data).addClass(cssClass);
                    }else {
                        alert(res.info);
                        return
                    }
                }
            }
            $.ajax(options)
        }
        //pc的LOgo
        $('#file_upload').change(function () {
            oInput = $('#file_upload')
            if (oInput.length <= 0) {
                return window.alert('请选择文件')
            }
            var file;
            file = oInput[0].files[0]
            var fd = new FormData()
            fd.append('myfile', file)
            //调用上传函数
            qiniuUpload(fd, '#txtimg', 'img_style');
        });

        //微信图片
        $('#file_upload_weixin').change(function () {
            oInput = $('#file_upload_weixin')
            if (oInput.length <= 0) {
                return window.alert('请选择文件')
            }
            var file;
            file = oInput[0].files[0]
            var fd = new FormData()
            fd.append('myfile', file)
            //调用上传函数
            qiniuUpload(fd, '#txtimg_weixin', 'img_style');
        });

        //手机端logo
        $('#file_upload_mobile_logo').change(function () {
            oInput = $('#file_upload_mobile_logo')
            if (oInput.length <= 0) {
                return window.alert('请选择文件')
            }
            var file;
            file = oInput[0].files[0]
            var fd = new FormData()
            fd.append('myfile', file)
            //调用上传函数
            qiniuUpload(fd, '#txtimg_mobile_logo', 'img_style');
        });

        //左侧广告图片
        $('#file_upload_adimg').change(function () {
            oInput = $('#file_upload_adimg')
            if (oInput.length <= 0) {
                return window.alert('请选择文件')
            }
            var file;
            file = oInput[0].files[0]
            var fd = new FormData()
            fd.append('myfile', file)
            //调用上传函数
            qiniuUpload(fd, '#txtimg_mobile_adimg', 'img_style');
        });
    }

    $(function() {
        //点击提交
        $('input[type=submit]').click(function (event) {
            var company_logo = $('#txtimg').attr('src');
            var weixin_img = $('#txtimg_weixin').attr('src');
            var mobile_logo = $('#txtimg_mobile_logo').attr('src');
            var leftad_img = $('#txtimg_mobile_adimg').attr('src');
            var company_name = $('input[name=company_name]').val();
            var connect_tel = $('input[name=connect_tel]').val();
            var legalpeople = $('input[name=legalpeople]').val();
            var connect_method = $('input[name=connect_method]').val();
            var company_address = $('input[name=company_address]').val();
            var qq1 = $('input[name=qq1]').val();
            var fax_num = $('input[name=fax_num]').val();
            var leftad_name = $('input[name=leftad_name]').val();
            var icp_code = $('input[name=icp_code]').val();

            var connect_people = $('input[name=connect_people]').val();
            var qq2 = $('input[name=qq2]').val();
            var email = $('input[name=email]').val();
            var leftlink = $('input[name=leftlink]').val();

            $.ajax({
                url: '/admin/company/companyedit',
                data: {
                    company_logo: company_logo,
                    weixin_img:weixin_img,
                    mobile_logo:mobile_logo,
                    leftad_img:leftad_img,
                    company_name:company_name,
                    connect_tel:connect_tel,
                    legalpeople:legalpeople,
                    connect_method:connect_method,
                    company_address:company_address,
                    qq1:qq1,
                    icp_code: icp_code,
                    fax_num:fax_num,
                    leftad_name:leftad_name,
                    connect_people:connect_people,
                    qq2:qq2,
                    email:email,
                    leftlink:leftlink,
                },
                type: 'post',
                success:function (res) {
                    alert(res.info);
                    event.preventDefault();
                }
            })
        })
    });
</script>
</html>